<!doctype html><html><!-- InstanceBegin template="/Templates/mybaihe2.dwt" codeOutsideHTMLIsLocked="false" -->
<head>
<meta charset="utf-8">

<link rel="shortcut icon" type="image/x-icon" href="image/favicon.ico">
 <link rel="stylesheet" href="mybaihe2.css" type="text/css"/>
<!-- InstanceBeginEditable name="doctitle" -->
<title>我的标签 </title>
<!-- InstanceEndEditable -->
<!-- InstanceBeginEditable name="stylee" -->
    <style>

*{
  margin: 0;
  padding: 0;
  outline: none;
  border: none;
	box-sizing: border-box;
}
*:before,
*:after{
	box-sizing: border-box;
}
html,
body{
	min-height: 100%;
}
body{
	background-image: radial-gradient(mintcream 0%, lightgray 100%);
	background:#FFF;
}
h1{
	display: table;
	margin: 5% auto 0;
	text-transform: uppercase;
	font-family: 'Anaheim', sans-serif;
	font-size: 4em;
	font-weight: 400;
	text-shadow: 0 1px white, 0 2px black;
}
.container{
	margin: 4% auto;
	width: 210px;
	height: 140px;
	position: relative;
	perspective: 1000;
}
#carousel{
	width: 100%;
	height: 100%;
	position: absolute;
	transform-style: preserve-3d;
	animation: rotation 20s infinite linear;
}
#carousel:hover{
	animation-play-state: paused;
}
#carousel figure{
	display: block;
	position: absolute;
	width: 255px;
	height: 289px;
	left: 17px;
	top: -14px;
	background: black;
	overflow: hidden;
	border: solid 5px black;
}
#carousel figure:nth-child(1){transform: rotateY(0deg) translateZ(288px);}
#carousel figure:nth-child(2) { transform: rotateY(40deg) translateZ(288px);}
#carousel figure:nth-child(3) { transform: rotateY(80deg) translateZ(288px);}
#carousel figure:nth-child(4) { transform: rotateY(120deg) translateZ(288px);}
#carousel figure:nth-child(5) { transform: rotateY(160deg) translateZ(288px);}
#carousel figure:nth-child(6) { transform: rotateY(200deg) translateZ(288px);}
#carousel figure:nth-child(7) { transform: rotateY(240deg) translateZ(288px);}
#carousel figure:nth-child(8) { transform: rotateY(280deg) translateZ(288px);}
#carousel figure:nth-child(9) { transform: rotateY(320deg) translateZ(288px);}

#imgg {
	-webkit-filter: grayscale(1);
	cursor: pointer;
	transition: all .5s ease;
}
#imgg:hover{
	-webkit-filter: grayscale(0);
  transform: scale(1.2,1.2);
}
.xuanzhong1{
	cursor:pointer;
}

@keyframes rotation{
	from{
		transform: rotateY(0deg);
	}
	to{
		transform: rotateY(360deg);
	}
}
    </style>

  <script src="js/prefixfree.min.js"></script>
	 <script src="js/jquery-1.11.3.js"></script>
<!-- InstanceEndEditable -->
<!-- InstanceBeginEditable name="head" -->
<!-- InstanceEndEditable -->
</head>

<body>
	<!--头部-->
	<header>
    	<script type="text/javascript" src="js/header.js"></script>
    </header>
    <script>var uls=document.getElementsByClassName("menu_more");
	for(var i=0;i<uls.length;i++){
		uls.item(i).onmouseover=function(){
			this.getElementsByTagName("ul")[0].style.display="block";
		}
		uls.item(i).onmouseout=function(){
			this.getElementsByTagName("ul")[0].style.display="none";
		}
		
	}
		$.post("regLogServlet?t="+new Date(),{op:"getUserLoginInfo"},function(data){
		var str="";
		var str2="image/mybaihee/zaza/1_1.png";
		var pic="";
		
		if(data==0){ //没有登录
			str="<p><a href='register.html' class='set'>注册</a><a href='login.html' class='up'>登录</a></p>"
		}else{
			str="<p><a style='color:red' href='mybaihee.jsp' class='set'>"+data.loginUserInfo[0].NICKNAME+"</a><a href='login.html' class='up'>[切换用户]</a></p>"
			str2="<img src='"+data.loginUserInfo[0].TOUXIANG+"' class='aaa' style='height:100px;width:100px;'/><br/>";
		}
		$(".setUp").html(str);
		$(".aa").html(str2);
	},"json");
	</script>
    <!--左部-->
    <div id="second">
        <div id="a">
        	<div class="aa">
        		<img class="aaa" src="image/1442748364541.gif"></br>
            </div>
        	<a href="photo.html">&nbsp;上传照片&nbsp;</a>
        	<a href="ziliao.html">&nbsp;编辑资料&nbsp;</a>
            <ul>
            	<li>我的等级：普通会员</li>
                <li>认证等级：1级</li>
            </ul>
            <div class="ab">
            	<ul>
                	<li class="abb">3</br><a href="">消息</a></li>
                    <li class="abb">0</br><a href="">红豆</a></li>
                    <li>0</br><a href="">花瓣</a></li>
                </ul>
            </div>
        </div>
        
        <div id="b">
        <h3>推荐服务</h3>
        	<ul>
            	<li class="b1"><a href=""><img src="image/xiao/1.png" height="25px" width="25px">水晶会员</a>&nbsp;&nbsp;&nbsp;&nbsp;<div class="bb">开&nbsp;通</div><p class="bbb">红娘帮忙牵线搭桥寻对象</p></li>
                <li><a href=""><img src="image/xiao/2.png" height="25px" width="25px">红娘牵线</a>&nbsp;&nbsp;&nbsp;&nbsp;<div class="bb">开&nbsp;通</div><p class="bbb">更多展示机会,提高成功</p></li>
                <li><a href=""><img src="image/xiao/3.png" height="25px" width="25px">至尊会员</a>&nbsp;&nbsp;&nbsp;&nbsp;<div class="bb">开&nbsp;通</div><p class="bbb">百合通用虚拟货币</p></li>
                <li><a href=""><img src="image/xiao/4.png" height="25px" width="25px">百合红豆</a>&nbsp;&nbsp;&nbsp;&nbsp;<div class="bb">开&nbsp;通</div></li>
                <li><a href="" class="b5">更多</a></li>
            </ul>
        </div>
        
        <div id="c">
        	<h3>百合应用</h3>
        	<ul>
            	<li><a href=""><img src="image/xiao/a.png" height="25px" width="25px">恋爱帮帮忙</a></li>
            	<li><a href=""><img src="image/xiao/b.png" height="25px" width="25px">成长俱乐部</a></li>
                <li><a href=""><img src="image/xiao/c.png" height="25px" width="25px">丘比特之箭</a></li>
                <li><a href=""><img src="image/xiao/d.png" height="25px" width="25px">心灵匹配测试</a></li>
                <li><a href=""><img src="image/xiao/e.png" height="25px" width="25px">Love双重奏</a></li>
                <li><a href=""><img src="image/xiao/f.png" height="25px" width="25px">红豆工厂</a></li>
                <li><a href=""><img src="image/xiao/g.png" height="25px" width="25px">花瓣抽奖</a></li>
                <li><a href=""><img src="image/xiao/h.png" height="25px" width="26px">幸运宝藏</a></li>
                <li><a href=""><img src="image/xiao/i.png" height="25px" width="26px">相亲助手</a></li>
                <li><a href=""><img src="image/xiao/j.png" height="25px" width="27px">恋爱ing</a></li>
            </ul>
       </div>
        
        <div id="d">
        <h3>百合账户</h3>
        	<ul>
            	<li><a href=""><img src="image/xiao/z1.png" height="25px" width="25px">我的资料</a></li>
            	<li><a href=""><img src="image/xiao/z2.png" height="25px" width="25px">我的照片</a></li>
                <li><a href=""><img src="image/xiao/z3.png" height="25px" width="25px">我的认证</a></li>
                <li><a href=""><img src="image/xiao/z4.png" height="25px" width="25px">手机认证</a></li>
                <li><a href=""><img src="image/xiao/z5.png" height="25px" width="25px">实名认证</a></li>
                <li><a href=""><img src="image/xiao/z6.png" height="25px" width="25px">择偶意向</a></li>
                <li><a href=""><img src="image/xiao/z7.png" height="25px" width="25px">账号设置</a></li>
            </ul>
      </div>
    </div>
    
    <!--右部-->
    <div id="third">
        <div class="myData">
        
            <h3>
                <div class="speed">
                    <div class="box"><div style="width:0;" class="strip"></div></div> 
                    <span>资料完整度</span><span class="orangeT" id="dataOrang">0%</span>
                </div>
                <p class="zi">我的资料</p>
            </h3>
            
            <div class="mainNav" id="wmainNav">
            	<ul>
            		<li tabIndex="0"><a href="ziliao.html">基本资料</a></li>
            		<li tabIndex="1"><a href="photoTest.html">我的照片</a></li>
                	<li tabIndex="2"><a href="myself.html">自我介绍</a></li>
                	<li tabIndex="3"><a href="music.html" class="active">我的性格</a></li>
                	<li tabIndex="4"><a href="mylike.html">个人喜好</a></li>
            	</ul>
            </div>
            
           <div class="wswich">
            <!--此处为基本资料-->
			<!-- InstanceBeginEditable name="body" -->
            	<div id="biaoqian">
                	 <div class="ti">
                    	<p>请完成下列的题，您的资料完整度增加<span style="color:#FE812F">40%</span>哦！</p>
                    </div>
                    <div id="bq_shi">
						<span>您觉得以下哪个词最适合你？</span><p>悄悄告诉你，可以多选哦！！</p><br /><br />
                    	<div class="container">
		`					<div id="carousel">
								<figure><img src="image/mybaihee/beautiful/biaoqian1.jpg" class="imgg" title="女强人" width="375" height="334"></figure>
                                <figure><img src="image/mybaihee/beautiful/biaoqian2.jpg" class="imgg" title="妩媚动人" height="405"></figure>
                                <figure><img src="image/mybaihee/beautiful/biaoqian3.jpg" class="imgg" title="大家闺秀" height="405"></figure>
                                <figure><img src="image/mybaihee/beautiful/biaoqian4.jpg" id="imgg" title="天生丽质" height="405"></figure>
                                <figure><img src="image/mybaihee/beautiful/biaoqian5.jpg" id="imgg" title="活泼可爱" height="405"></figure>
                                <figure><img src="image/mybaihee/beautiful/biaoqian6.jpg" id="imgg" title="清新单纯" width="300" height="289"></figure>
                                <figure><img src="image/mybaihee/beautiful/biaoqian4.jpg" id="imgg" title="天生丽质" ></figure>
                                <figure><img src="image/mybaihee/beautiful/biaoqian5.jpg" id="imgg" title="活泼可爱" height="405"></figure>
                                <figure><img src="image/mybaihee/beautiful/biaoqian6.jpg" id="imgg" title="清新单纯" width="300" height="289"></figure>
                                
							</div>
						</div>

                    <div style="text-align:center;clear:both">
                    
                    </div>
                    
                    <div id="xuan" >
                    	<span>您选中的类型为：</span><p>如果您不要我了，就点下我吧</p>
                        <div id="xuanzhong">
                        	<!--<img src="" class="xuanzhong1" onClick="appeall()" title="">-->
                        </div>
                    </div>
                     <a href="javascript:;" class="orange" id="saveInfo">保 存</a>
                 </div>
              </div>
			<!-- InstanceEndEditable -->
            
           </div>
        </div>
    </div>
  	<div id="four">
    	<img src="image/1.jpg" height="90px" width="1000px">
    </div>
    <!--尾部-->
    <script type="text/javascript" src="js/foot.js" charset='utf-8'></script>
</body>
<!-- InstanceEnd --></html>
<script>

	
		/*$("#imgg").css("border","4px solid #F00");*/
		
		$("#carousel figure img").click(function(){
			
			$("#xuan").css("display","block");
			 var url=$(this).prop("src");
			 var title=$(this).prop("title");
			 var img = document.createElement("img");
			
			img.setAttribute("class", "xuanzhong1");
			/*img.setAttribute("onClick", "appeall()");*/
			img.setAttribute("title", title);
			img.src = url;
			
			document.getElementById("xuanzhong").appendChild(img);
			
			$("#xuanzhong img").click(function(){
			$(this).hide("slow");
			})
		})
		
</script>

<style>
	
#bq_shi a {
	margin-top:50px;
    background: #ff7f00 none repeat scroll 0 0;
    border-radius: 10px;
    color: #fff;
    font-size: 16px;
    margin-left: 250px;
    padding: 10px 50px;
    text-align: center;
}
	#xuan{
		margin-top:300px;
		width:800px;
		height:350px;
		border:1px solid #E5E8E8;
		display:none;
		margin-bottom:30px;
		}
	#xuan span{
		font-size:20px;
		font-family:"宋体";
		font-weight:300;
		color:#FE812F;
		}
	.xuanzhong1{
		margin-top:20px;
		margin-left:20px;
		float:left;
		margin-right:10px;
		height:200px;
		width:200px;
		}
</style>